<template>
<el-dialog :title="type==1?'申请售后':'申请维修'" :visible.sync="dialogFormVisible1" width="600px">
    <el-form :model="form1" ref="form1" :rules="rules1" label-position="right" label-width="140px">
        <el-form-item v-if="type==1" label="售后类型" prop="type">
            <el-select class="vs-w-300" clearable v-model="form1.type" placeholder="请选择售后类型">
                <el-option label="退货" value="1"></el-option>
                <el-option label="换货" value="2"></el-option>
                <el-option label="维修" value="3"></el-option>
            </el-select>
        </el-form-item>
        <el-form-item label="要求返回门店日期" prop="date">
            <el-date-picker class="vs-w-300" value-format="yyyy-MM-dd" v-model="form1.date" type="date" placeholder="选择日期"></el-date-picker>
        </el-form-item>
        <el-form-item label="具体描述" prop="describe">
            <el-input class="vs-w-300" clearable v-model="form1.describe" placeholder="请输入"></el-input>
        </el-form-item>
        <el-form-item style="width: 100%" label="图片示例：" prop="picture">
            <vs-uploading width="120px" height="120px" :maxNum="3" ref="uploading" v-model="form1.picture"></vs-uploading>
        </el-form-item>
        <el-form-item label="物流公司" prop="logistics_company">
            <el-input class="vs-w-300" clearable v-model="form1.logistics_company" placeholder="请输入"></el-input>
        </el-form-item>
        <el-form-item label="物流单号" prop="logistics_number">
            <el-input class="vs-w-300" clearable v-model="form1.logistics_number" placeholder="请输入"></el-input>
        </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible1 = false">取 消</el-button>
        <el-button type="primary" @click="receipt">确 定</el-button>
    </div>
</el-dialog>
</template>
<script>
    import VsUploading from '@/components/VsUploading.vue';
export default {
    components:{ VsUploading},
    props: {
        value:{
            type:Boolean,
            default:false
        },
        id:{
            type:[String,Number],
            default:"",
        },
        type:{
            type:Number,
            default:1,
        },
    },
    computed: {
        dialogFormVisible1:{
            set(val) {
                this.$emit('input',val)
            },
            get(){
                return this.value
            }
        }
    },
    data() {
        return{
            form1: {
                date: '',
                describe: '',
                picture: [],
                logistics_company: '',
                logistics_number: '',
                type: '',
            },
            rules1: {
                describe: { required: true, message: '请输入具体描述', trigger: 'blur' },
                date: { required: true, message: '请选择返回门店日期', trigger: 'change' },
                picture: { required: true, message: '请上传图片', trigger: 'blur' },
                logistics_number: {
                    required: true,
                    message: '请输入物流单号',
                    trigger: 'blur',
                },
                logistics_company: {
                    required: true,
                    message: '请输入物流公司',
                    trigger: 'blur',
                },
                type: { required: true, message: '请选择售后类型', trigger: 'change' },
            },
        }
    },
    watch: {
        value(val){
            if(val){
                this.form1 = this.$options.data().form1;
                this.$refs['form1']?.resetFields();
                if(this.type==2){
                    this.form1.type = 3;
                }
            }
        }
    },
    created(){
        if(this.type==2){
            this.form1.type = 3;
        }
    },
    methods: {
        //   申请售后
        receipt() {
            this.$refs['form1'].validate(async (valid) => {
                if (!valid) return;
                let obj = Object.assign({}, this.form1);
                obj.picture = obj.picture.join(',');
                obj.take_ticket_id = this.id;
                let { code } = await this.$Http.specialAfterSale(obj);
                if (code) {
                    this.dialogFormVisible1 = false;
                    this.$message.success('申请成功!');
                    this.$emit('success')
                    // this.getProduction(id);
                }
            });
        },
    }

}
</script>
<style lang="scss" scoped>

</style>